<%--
  Created by IntelliJ IDEA.
  User: hasee
  Date: 2021/11/8
  Time: 19:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Pixiv</title>
    <link rel = "stylesheet" href = "${pageContext.request.contextPath}/common/layui/css/layui.css">
    <script src = "${pageContext.request.contextPath}/common/jquery3.6.0.js"></script>
    <script src = "${pageContext.request.contextPath}/common/layui/layui.js"></script>
    <style type = "text/css">
        *{
            padding:0px;
            margin:0px;
        }
    </style>
</head>
<body>
    <img src="${pageContext.request.contextPath}/register/getBack"
     style = "background-color:white;width:100%;height:100%;" >

    <input type = "button" id = "gotoLogin" value = "登录">

    <div id = "loginRegisterBackground">
        <div><p>Pixiv</p><p>兴趣</p></div>
        <input type = "button" id = "RegisterButton" value = "注册账号">
        <input type = "button" id = "LoginButton" value = "登录">
        <p>注册或者登录</p>
    </div>
    <script type = "text/javascript">

        document.querySelector("#RegisterButton").onclick = function(){
            $.ajax({
                url:"/pixiv/RegisterUserServlet",
                data:{"appType":"InitGotoRegister"},
                //data:JSON.stringfty()
                //dataType:application;
                dataType:"json",
                type:"post",
                success:function(req){
                    if (req.flag == 1)
                    {
                        location.href = "${pageContext.request.contextPath}/register/gotoRegisterLogin";
                    }
                    return false;
                }
            });
        }
        document.querySelector("#LoginButton").onclick = function(){
            $.ajax({
                url:"/pixiv/LoginServlet",
                data:{"appType":"InitGotoLogin"},
                dataType:"json",
                type:"post",
                success:function(req){
                    if (req.flag == 1)
                    {
                        location.href = "${pageContext.request.contextPath}/register/gotoLogin";
                    }
                    return false;
                }
            });
        }

    </script>

    <style type = "text/css">
        #loginRegisterBackground{
            position:absolute;
            width:26%;
            height:500px;
            left:37%;
            top:150px;
            background-color:rgba(255,255,255,0.8);
            z-index:5;
            text-align:center;
        }
        #loginRegisterBackground>div:nth-child(1)
        {
            width:100%;
            height:100px;
            text-align:center;
        }


        #RegisterButton{
            margin-top:10px;
            position:relative;
            width:80%;
            height:40px;
            border-radius:15px;
            border:0px;
            background-color:rgba(143,147,204,1.0);
            color:rgba(255,255,255,1.0);
            font-size:15px;
        }
        #RegisterButton:hover{
            background-color:rgba(125,115,173,1.0);
        }
        #LoginButton{
            margin-top:10px;
            position:relative;
            width:80%;
            height:40px;
            border-radius:15px;
            border:0px;
            background-color:rgba(220,220,220,1.0);
            color:rgba(10,10,10,1.0);
            font-size:15px;
        }
        #LoginButton:hover{
            background-color:rgba(160,160,160,1.0);
        }
    </style>
</body>
</html>
